
<div>
	<form nz-form (ngSubmit)="_submitForm()">
      	<div nz-form-item nz-row style="margin-top:25px;">
	      	<div nz-col [nzSm]="24">
		        <div class="text-left">
		          	<label for="email">商品名称/商品编号：</label>
		          	<nz-input [nzSize]="'large'" name="keyword" [(ngModel)]="searchValue" [nzPlaceHolder]="'请输入商品名称'" style="width: 185px;" (keydown)="keyDown($event)"></nz-input>
		          	<button nz-button [nzType]="'primary'" [nzSize]="'large'" style="margin-left:22px;">查询</button>
		          	<button nz-button class="ml-7" (click)="resetForm($event)" [nzSize]="'large'">重置</button>
		        </div>
		    </div>
      	</div>
  	</form>
  	<div class="product-operate clearfix">
  		<div nz-col [nzSm]="24">
	  		<button nz-button [nzType]="'primary'" [nzSize]="'large'" routerLink="/member/product/add">
	  			<i class="anticon anticon-plus"></i><span>新建商品</span>
	  		</button>
	  		<button [disabled]="!_indeterminate && !_allChecked" nz-button class="ml-7" [nzSize]="'large'" (click)="openGrounding('上架')">批量上架</button>
	  		<button [disabled]="!_indeterminate && !_allChecked" nz-button class="ml-7" [nzSize]="'large'"  (click)="openGrounding('下架')">批量下架</button>
	  	</div>
  	</div>
  	<div class="product-list-out">
  		<nz-table [nzLoading]="loading" [nzCustomNoResult]="true" [nzPageSize]="pageSize" [nzPageIndex]="page" (nzPageIndexChange)="changIndex($event)" [nzAjaxData]="goodsList" [nzTotal]="total">
  			<thead nz-thead>
		        <tr>
		        	<th nz-th [nzCheckbox]="true">
			            <label nz-checkbox [(ngModel)]="_allChecked" [nzIndeterminate]="_indeterminate" (ngModelChange)="_checkAll($event)">
			            </label>
			        </th>
		          	<th nz-th  style="min-width:280px;"><span>商品</span></th>
		          	<th nz-th style="min-width: 80px;"><span>状态</span></th>
		          	<th nz-th style="min-width:100px">
		          		<span>价格</span>
                  <!--<nz-table-sort [(nzValue)]="orderJson.price" (nzValueChange)="sort('price',$event)"></nz-table-sort>-->
		          </th>
		          	<th nz-th style="min-width:80px">
		          		<span>热门推荐</span>
		          		<!--<nz-table-sort [(nzValue)]="orderJson.sales_total" (nzValueChange)="sort('sales_total',$event)"></nz-table-sort>-->
		          	</th>
		          	<th nz-th style="min-width: 120px;"><span>操作</span></th>
		        </tr>
		    </thead>
		    <tbody nz-tbody *ngIf="goodsList.length>0">
		        <tr nz-tbody-tr *ngFor="let item of goodsList">
		        	<td nz-td [nzCheckbox]="true">
			            <label nz-checkbox [(ngModel)]="item.checked" (ngModelChange)="_refreshStatus($event)">
			            </label>
			        </td>
		          	<td nz-td>
		            	<div class="product-cover fl">
		            		<img *ngIf="item.picture" style="width:100%;height:100%" [src]="item.picture"/>
		            	</div>
		            	<div style="padding-left:48px;" class="ml-15 ver-mid">
		            		<div >
		            			<span class="product-id mr-5" >
		            				<span>
		            					商品编号:{{ item.numbers}}
		            				</span>
		            			</span>
		            			<div class="dis-inline">
		            				<nz-tag [nzColor]="'#108ee9'" *ngFor="let item2 of item.categories">{{item2.name}}</nz-tag>
		            			</div>
		            		</div>
		            		<div class="mt-5">{{item.name}} </div>
		            	</div>
		          	</td>
		          	<td nz-td>
		          		<span class="product-state" [class.grounding]="item.for_sale===1" ></span><span>{{item.for_sale===1 ?"上架中":"下架中"}}</span>
		          	</td>
		          	<td nz-td>
		          		<div class="">￥ {{item.price_discount}}</div>
		          		<div class=" ">
		          			<div class="">原价：{{item.price_origin}} </div>
		          		</div>
		          	</td>
		          	<td nz-td>
                  {{item.is_recommend ===1 ?"是":"否"}}
		          	</td>
		          	<td nz-td>
		          		<a [routerLink]="'/member/product/edit/'+item.id">编辑</a>
              			<span nz-table-divider></span>
              			<nz-dropdown>
			                <a class="ant-dropdown-link" nz-dropdown>
			                   更多<i class="anticon anticon-down"></i>
			                </a>
			                <ul nz-menu class="more-operate">
			                  	<!-- <li nz-menu-item>
			                    	<a>编辑</a>
			                  	</li> -->
			                  	<li nz-menu-item [class.btnDisable]="item.for_sale==1" (click)="openGrounding('上架',item)" >
			                    	<a>上架</a>
			                  	</li>
			                  	<li nz-menu-item [class.btnDisable]="item.for_sale!=1" (click)="openGrounding('下架',item)">
			                    	<a>下架</a>
			                  	</li>
			                  	<li nz-menu-item (click)="productDel(item)">
			                    	<a>删除</a>
			                  	</li>
			                </ul>
			            </nz-dropdown>
		          	</td>
		        </tr>
		    </tbody>
		    <div noResult>
		    	<div class="text-center" style="margin-top:132px;">
		    		<i class="empty-icon" ></i>
		    		<p>目前并无任何商品</p>
		    		<p>请添加商品</p>
		    	</div>
		    </div>
  		</nz-table>
  	</div>
</div>

<nz-modal [nzVisible]="groundingVisible" [nzTitle]="'确认要上架此商品？'" [nzContent]="modalContent" (nzOnCancel)="groundingVisible=false" (nzOnOk)="handleOk($event)">
  	<ng-template #modalContent>
	    <p>上架后，此商品会移动至分类上架中 </p>
  	</ng-template>
</nz-modal>
